<template>
    <pagetitle></pagetitle>
    <el-card>
        <el-form :model="pageData" class="formbox plantresourcemsg" label-width="140px" :disabled="formDisabled" label-position="right">
            <div class="formboxitem">
                <div class="title">新增种植资源</div>
                <el-form-item label="客户名称：">
                    <!-- <el-input v-model="pageData.companyName" disabled class="inputs" placeholder=""></el-input> -->
                    <el-select v-model="pageData.value" class="inputs" placeholder="请选择客户">
                        <el-option label="data" value="item.value" />
                    </el-select>
                    <span class="formTip">*从客户列表选择</span>
                </el-form-item>
                <el-form-item label="地块编号：">
                    <el-select v-model="pageData.value" class="inputs" placeholder="请选择地块编号">
                        <el-option label="data" value="item.value" />
                    </el-select>
                </el-form-item>
                <el-form-item label="地块名称：">
                    <el-input v-model="pageData.companyName" class="inputs" placeholder="请输入地块名称"></el-input>
                    <span class="formTip">*根据地块编号自动填写，无法修改</span>
                </el-form-item>
            </div>
            <div class="formboxitem">
                <div class="title">种植资源信息</div>
                <el-form-item label="种植资源类型：">
                    <!-- <el-input v-model="pageData.companyName" disabled class="inputs" placeholder=""></el-input>
                    <span class="formTip">*自动识别当前团队名称，无法修改</span> -->
                </el-form-item>
                <el-form-item label="搜索添加：">
                    <div class="selectorbtn">
                        <el-select v-model="pageData.value" class="selectorbtn_select" placeholder="从数据库中模糊搜索">
                            <el-option label="data" value="item.value" />
                        </el-select>
                        <div class="selectorbtn_btn">搜索</div>
                    </div>
                </el-form-item>
                <el-form-item label="种植资源类型：">
                    <div class="selectorbtn">
                        <el-select v-model="pageData.value" class="classfiy_select" placeholder="门类">
                            <el-option label="data" value="item.value" />
                        </el-select>
                        <el-select v-model="pageData.value" class="classfiy_select" placeholder="大类">
                            <el-option label="data" value="item.value" />
                        </el-select>
                        <el-select v-model="pageData.value" class="classfiy_select" placeholder="中类">
                            <el-option label="data" value="item.value" />
                        </el-select>
                        <el-select v-model="pageData.value" class="classfiy_select" placeholder="小类">
                            <el-option label="data" value="item.value" />
                        </el-select>
                        <el-select v-model="pageData.value" class="classfiy_select" placeholder="品名">
                            <el-option label="data" value="item.value" />
                        </el-select>
                    </div>
                    <span class="formTip">*从数据库中分类选择</span>
                </el-form-item>
                <el-form-item label="说明：">
                    <el-input v-model="pageData.companyName" type="textarea" :rows="4" resize="none" placeholder="自动导入品名说明"></el-input>
                </el-form-item>
            </div>
            <div class="formboxitem">
                <div class="title">栽种信息</div>
                <el-form-item label="栽种方式：">
                    <el-radio-group v-model="pageData.createUserPost" size="large">
                        <div class="radiobutton" v-for="(item, index) in cardType" :key="index">
                            <el-radio-button :label="item" />
                        </div>
                    </el-radio-group>
                </el-form-item>
                <el-form-item label="种植年份：">
                    <el-date-picker
                        v-model="pageData.input"
                        type="month"
                        range-separator="—"
                        placeholder="请选择月份"
                        class="date_picker_inputs"
                        format="YYYY/MM/DD"
                        value-format="YYYY-MM-DD"
                        :clearable="false"
                    />
                </el-form-item>
                <el-form-item label="株间距：">
                    <el-input v-model="pageData.companyName" class="inputs" placeholder="请输入作物栽培的株间距">
                        <template #append>米</template>
                    </el-input>
                </el-form-item>
                <el-form-item label="行间距：">
                    <el-input v-model="pageData.companyName" class="inputs" placeholder="请输入作物栽培的行间距">
                        <template #append>米</template>
                    </el-input>
                </el-form-item>
                <el-form-item label="电子围栏面积：">
                    <el-input v-model="pageData.companyName" class="inputs" placeholder="自动计算电子围栏面积">
                        <template #append>亩</template>
                    </el-input>
                    <span class="formTip">*电子围栏圈定总面积</span>
                </el-form-item>
                <el-form-item label="亩栽培量：">
                    <el-input v-model="pageData.companyName" class="inputs" placeholder="自动计算亩栽培量">
                        <template #append>株</template>
                    </el-input>
                    <span class="formTip">=666/(株间距*行间距）</span>
                </el-form-item>
                <el-form-item label="总栽培量：">
                    <el-input v-model="pageData.companyName" class="inputs" placeholder="自动计算总栽培量">
                        <template #append>株</template>
                    </el-input>
                    <span class="formTip">=电子围栏面积*亩栽培量</span>
                </el-form-item>
            </div>
            <div class="formboxitem">
                <div class="title">GIS信息</div>
                <el-form-item label="地块位置：">
                    <addRess class="inputs" placeholder="请选择地块地址"></addRess>
                </el-form-item>
                <el-form-item label="">
                    <el-input v-model="pageData.companyName" class="inputs" placeholder="请输入详细地址"></el-input>
                </el-form-item>
                <mars3d class="mars3ds"></mars3d>
            </div>
            <div class="formboxitem">
                <el-button class="submitbtn" text bg>添加资源</el-button>
            </div>
        </el-form>
    </el-card>
</template>
<script lang="ts" setup>
// import mars3d from "@/components/mars3d.vue";
import { ref } from "vue";
import { useRouter, useRoute } from "vue-router";
import mars3d from "@/views/editorMap/index.vue";

import { companyInfo } from "@/api/team";
const router = useRouter();
const route = useRoute();

const cardType = ref(["多年生", "当季"]);
const pageData: any = ref({});

console.log(route);
// 页面类型
const pageType = route.query;
const formDisabled = ref(false);
const uploadFiles = () => {};
</script>
